import React from 'react';

import { WhatsAppOutlined,CommentOutlined } from '@ant-design/icons';
import './style.less';
import { Amap, Marker } from '@amap/amap-react';
import Header from '../../components/header/header';
import Footer from '../../components/footer';
import {Form,Input,Button,message } from 'antd';
import ditu from '../../assets/地图.png';
const { TextArea } = Input;

export default function MessageBoard() {

    const [form] = Form.useForm();

    // 4de739150647ed6d64aabff3483152ca


    return (<div >
            <Header/>
        <div className="message-page">
        
            <WhatsAppOutlined style={{ color: "#4275B3" }} /> 
            &nbsp;
            联系我们
        </div>

        <div className="tele">
            <div className="person-name-dept">
                市场部-孙工
            </div>
            <div  className="lianxi">
                <p> 电话：0517-88888888</p>
                <p> 手机：18888888888</p>
                <p> 邮箱：xxx@sina.com</p>

            </div>
        </div>

        <div className="site">
            地址详情
            <img src={ditu}>
            </img>

     
        </div>
        <div  className="message">
         <div  className="message-text">
         <CommentOutlined />  &nbsp; 
         给我们留言

         </div>
         <div  className="message-form">
    <Form form={form}>

    <Form.Item
        label="姓名"
        name="username"
       
        rules={[{ required: true, message: '请输入您的姓名' }]}
      >
        <Input  placeholder="请输入您的姓名"/>
      </Form.Item>
      <Form.Item
        label="邮箱"
        name="email"
       
        rules={[{ required: true, message: '请输入您的邮箱' }]}
      >
        <Input  placeholder="请输入您的邮箱"/>
      </Form.Item>
      <Form.Item
        label="电话号码"
        name="telephone"
       
        rules={[{ required: true, message: '请输入您的电话号码' }]}
      >
        <Input  placeholder="请输入您的电话号码"/>
      </Form.Item>
      <Form.Item
        label="留言内容"
        name="text"
       
        rules={[{ required: true, message: '请输入您的留言内容' }]}
      >
        <TextArea rows={4}  placeholder="请输入您的留言内容"/>
      </Form.Item>
      <p style={{color:"red"}}> *有关个人资料的处理本网站会将获取个人信息妥善保管，未经本人同意，本站不会向任何第三方披露。</p>
      <Form.Item
      >
        <Button htmlType="submit" style={{height:"40px",backgroundColor:"#4275B3",color:"white"}}  Primary block onClick={()=>{
       form.validateFields().then(()=>{ message.info('提交成功')}).catch(()=>{message.info('提交失败');});
           
        // }catch(err){
        //     message.info('提交失败');
        // }
        //    if(form.validateFields()){
        //     message.info('This is a normal message');
        //    }
        }} >确认提交</Button>
      </Form.Item>
    </Form>
    
  
         </div>
        </div>
  
       
        <Footer/>
    </div>)
}